<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>思客多-商户登录</title>
    <meta name='description' content='思客多微商城小程序系统国内领先的微信公众平台开发服务商，提供微信商城、微信小程序、餐饮O2O、移动办公、智慧城市等一体化微信营销解决方案。'>
    <meta name='keywords' content='思客多,微信营销,微信商城,微信分销系统,微信定制开发,餐饮O2O,微网站,微商城,微营销,微信公众平台,微信小程序商城系统'>
    <link rel="stylesheet" href="{__ADMIN_PATH}/login/assets/css/index.css">
    <link rel="stylesheet" href="{__ADMIN_PATH}/login/assets/css/swiper.min.css">
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <script src="{__ADMIN_PATH}/login/assets/js/swiper.min.js"></script>
    <style>
        .swiper-pagination-bullet-active{
            width: 20px;
            border-radius: 10px;
        }
    </style>
</head>
<body>
<div class="header">
    <div class="h-box">
        <img src="{__ADMIN_PATH}/login/assets/img/logo.png" alt="">
        <div class="phone">
            <span class="icon"></span>
            <p>24小时服务电话：400-6809-711</p>
        </div>
    </div>
</div>
<div class="content">
    <div class="c-login">
        <div class="c-login-banner">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide"><img src="{__ADMIN_PATH}/login/assets/img/loginBg.png"/></div>
                    <div class="swiper-slide"><img src="{__ADMIN_PATH}/login/assets/img/registerBg.png"></div>
                    <div class="swiper-slide"><img src="{__ADMIN_PATH}/login/assets/img/forgetBg.png"></div>
                </div>
                <!-- 如果需要分页器 -->
                <div class="swiper-pagination"></div>
            </div>
        </div>
        <div class="c-login-box">
            <div class="b-tab">
                <span class="loginClick active">商户登录</span>
                <span class="registerClick">注册新账号</span>
            </div>
            <div class="b-input">
                <p>
                    <span class="icon icon-phone"></span>
                    <input type="text" id="account" placeholder="手机号码">
                </p>
            </div>
            <div class="b-input">
                <p>
                    <span class="icon icon-psd"></span>
                    <input type="password" id="pwd" placeholder="密码">
                </p>
            </div>
            <div class="b-input sendCode">
                <p>
                    <span class="icon icon-code"></span>
                    <input id="verify" type="text" placeholder="验证码">
                    <img id="verify_img" src="{:Url('captcha')}" alt="验证码">
                </p>
            </div>
            <div class="b-btn">
                <button id="do_login">登录</button>
            </div>
            <div class="b-tip">忘记密码？</div>
        </div>
        <div class="c-register-box" style="display: none">
            <div class="b-tab">
                <span class="loginClick">商户登录</span>
                <span class="registerClick active">注册新账号</span>
            </div>
            <div class="b-input">
                <p>
                    <span class="icon icon-user"></span>
                    <input id="real_name" type="text" placeholder="用户姓名">
                </p>
            </div>
            <div class="b-input">
                <p>
                    <span class="icon icon-phone"></span>
                    <input id="account0" type="tel" placeholder="手机号码">
                </p>
            </div>
            <div class="b-input">
                <p>
                    <span class="icon icon-address"></span>
                    <select id="province">
                        <option value="0">请选择省</option>
                        {foreach $cities as $k=>$v}
                        <option value="{$v['city_id']}">{$v['merger_name']}</option>
                        {/foreach}
                    </select>
                    <select id="city">
                        <option value="0">请选择市</option>
                    </select>
                </p>
            </div>
            <div class="b-input">
                <p>
                    <span class="icon icon-company"></span>
                    <input id="company_name" type="text" placeholder="用户公司">
                </p>
            </div>
            <div class="b-input">
                <p>
                    <span class="icon icon-psd"></span>
                    <input id="pwd0"  type="password" placeholder="密码">
                </p>
            </div>
            <div class="b-input">
                <p>
                    <span class="icon icon-invite"></span>
                    <input id="invite_code" type="text" placeholder="邀请码(必填)">
                </p>
            </div>
            <div class="b-input sendCode">
                <p>
                    <span class="icon icon-code"></span>
                    <input id="verify0" type="text" placeholder="验证码">
                    <input  type="button" id="getcode" value="发送验证码" onclick="daojishi(60)">
                </p>
            </div>
            <div class="b-treaty">
                <input type="checkbox" id="is_check">
                <span>登陆注册代表同意<a target="_blank" href="{:url('login/agreement')}">《注册协议》</a>和<a target="_blank" href="{:url('login/secrecy')}">《隐私协议》</a></span>
            </div>
            <div class="b-btn">
                <button id="do_register">注册</button>
            </div>
        </div>
    </div>
    <div class="c-record">COPYRIGHT  2013-2020 成都思软科技有限公司&nbsp;<a target="_blank" href="http://beian.miit.gov.cn/">蜀ICP备18038959号</a></div>
</div>
<!-- 全局js -->
<script src="{__PLUG_PATH}jquery-1.10.2.min.js"></script>
<script src="{__PLUG_PATH}layui/layui.all.js"></script>

<!-- 登陆 -->
<script>
    var $captcha = $('#verify_img'),src = $captcha[0].src;
    function captcha(){
        $captcha.click(function(){
            this.src = src+'?'+Date.parse(new Date());
        });
    }
    captcha();
    $('#do_login').on('click',function(){
        var account = $('#account').val(),pwd = $('#pwd').val(),verify = $('#verify').val();
        if(!account) return layer.msg('请输入登陆账号');
        if(!pwd) return layer.msg('请输入登陆密码');
        if(!verify) return layer.msg('请输入验证码');
        $.ajax({
            url: "{:url('login/verify')}",
            data: {
                account:account,
                pwd:pwd,
                verify:verify
            },
            type: 'post',
            dataType: 'json',
            success: function (rem) {
                if (rem.code == 200 || rem.status == 200) {
                    window.location.href = rem.data.url || '/admin/index/index.html';
                }else{
                    $('#verify_img').attr('src',src + '?' + Date.parse(new Date()));
                    layer.msg(rem.msg);
                }
            },
            error: function (err) {
                layer.msg('系统错误');
            }
        })
        return false;
    })
</script>
<!-- 注册 -->
<script>
    $("#province").change(function(){
        var url = "{:url('get_city')}";
        var parent_id = $('#province').val();
        $.ajax({
            url: url,
            data: {
                parent_id: parent_id,
            },
            type: 'post',
            dataType: 'json',
            success: function (rem) {
                if (rem.code == 200 || rem.status == 200) {
                    var c_citys = rem.data;
                    var html;
                    for (var i=0;i<c_citys.length;i++){
                        html +='<option value="'+c_citys[i]['merger_name']+'">'+c_citys[i]['name']+'</option>'
                    }
                    $('#city').html(html);
                } else {
                    layer.msg(rem.msg);
                }
            },
            error: function (err) {
                layer.msg('系统错误');
            }
        });

    });
    function daojishi(t) {
        var account = $('#account0').val();
        if (!account) return layer.msg('请输入手机号码');
        if(account.length!=11){
            return layer.msg('手机号码有误');
        }
        var url = "{:url('send_msg')}";
        $.ajax({
            url: url,
            data: {
                account: account,
            },
            type: 'post',
            dataType: 'json',
            success: function (rem) {
                if (rem.code == 200 || rem.status == 200) {
                    layer.msg(rem.msg);
                    var intv = setInterval( function(){
                        t--;
                        if( t > 0 )
                        {
                            $("#getcode").attr('disabled', 'disabled');
                            $("#getcode").val( t +'秒获取');
                        }
                        else
                        {
                            $("#getcode").attr('disabled', false );
                            $("#getcode").val( '获取验证码');
                            clearInterval(intv);
                        }
                    }, 1000);
                } else {
                    layer.msg(rem.msg);
                    return false;
                }
            },
            error: function (err) {
                layer.msg('系统错误');
                return false;
            }
        });
    }
    $('#do_register').on('click',function(){
        var is_check = $('#is_check').is(':checked');
        var real_name = $('#real_name').val(), invite_code  = $('#invite_code').val();
        var city_name = $('#city').val(), company_name = $('#company_name').val();
        var account   = $('#account0').val(), pwd = $('#pwd0').val(), verify = $('#verify0').val();
        if (!real_name) return layer.msg('请输入用户姓名');
        if (!account) return layer.msg('请输入手机号码');
        if (!city_name) return layer.msg('请输入地区名称');
        if (!company_name) return layer.msg('请输入公司名称');
        if(account.length!=11){
            return layer.msg('手机号码有误');
        }
        if (!pwd) return layer.msg('请输入登陆密码');
        if (!verify) return layer.msg('请输入验证码');
        if (!invite_code) return layer.msg('请输入邀请码');
        if (!is_check) return layer.msg('请同意注册协议');
        var url = "{:url('do_register')}";
        $.ajax({
            url: url,
            data: {
                real_name: real_name,
                invite_code: invite_code,
                account: account,
                pwd: pwd,
                verify: verify,
                company_name:company_name,
                city_name:city_name
            },
            type: 'post',
            dataType: 'json',
            success: function (rem) {
                if (rem.code == 200 || rem.status == 200) {
                    layer.msg(rem.msg);
                    setTimeout(function () {
                        window.location.href = rem.data.url;
                    },1000)
                } else {
                    layer.msg(rem.msg);
                }
            },
            error: function () {
                layer.msg('系统错误');
            }
        });
    });
</script>
<script>
    $(function(){
        $('.loginClick').click(() => {
            $('.c-login-box').show()
            $('.c-register-box').hide()
        })

        $('.registerClick').click(() => {
            $('.c-login-box').hide()
            $('.c-register-box').show()
        })

        $('.b-tip').click(() => {
            window.location.href = "{:url('forget_password')}"
        })
        var mySwiper = new Swiper ('.swiper-container', {
            // 轮播图的方向，也可以是vertical方向
            direction:'horizontal',
            //播放速度
            loop: true,
            // 自动播放时间
            autoplay:{
                disableOnInteraction: false,
                delay: 2000,
            },
            // 播放的速度
            speed:2000,
            // 如果需要分页器，即下面的小圆点
            pagination: {
                el: '.swiper-pagination',
            },
        });
    })
</script>
</body>
</html>